<template>
	<view class="content" :style="{'height':windowHeight+'px'}">
		<text class="title">班级信息</text>
		<uni-list style="width: 750rpx;">
			<uni-list-item title="班级编号" :rightText="classInfo.classNumber"></uni-list-item>
			<uni-list-item title="班级名称" :rightText="classInfo.className"></uni-list-item>
			<uni-list-item title="课程名称" :rightText="classInfo.courseName"></uni-list-item>
			<uni-list-item title="上课校区" :rightText="classInfo.schoolName"></uni-list-item>
			<uni-list-item title="上课时间" :rightText="classInfo.classTime"></uni-list-item>
			<uni-list-item title="精彩瞬间" link></uni-list-item>
		</uni-list>
		<text class="title">上课信息</text>
		<uni-list style="width: 750rpx;margin-bottom: 30rpx;">
			<uni-list-item title="任课老师" :rightText="classInfo.nickName"></uni-list-item>
			<uni-list-item title="助理老师" rightText="" link></uni-list-item>
			<uni-list-item title="消课课时" link>
				<template slot="footer">
					<picker @change="bindPickerChange" :value="classInfo.classDeductHours" :range="array">
						<view class="uni-input" style="color: #33BB44;font-size: 14px;">扣{{classInfo.classDeductHours+'.0课时'}}</view>
					</picker>
				</template>

			</uni-list-item>
			<uni-list-item title="消课时间" link>
				<template slot="footer">
					<uni-datetime-picker  :value="createTime" style="height: 20px; margin-right: -38px;margin-top: -10px;" :border="false">
					</uni-datetime-picker>
				</template>
			</uni-list-item>
			<uni-list-item title="签到记录" link></uni-list-item>
		</uni-list>
		<button @click="openSubmit" style="width: 700rpx;" class="button-green">确认，去消课</button>
		<uni-popup ref="popup" type="dialog">
			<uni-popup-dialog title="是否确认消课" :duration="2000" :before-close="true" @close="close" @confirm="confirm">
			</uni-popup-dialog>
		</uni-popup>
	</view>
</template>

<script>
	import {
		getClassInfo,delXiaokeCourceClass
	} from "../../../api/classTeacher.js"
	import {
		parseTime
	} from "../../../util/util.js"
	export default {
		data() {
			return {
				windowHeight: 0,
				classId: null,
				classInfo: {},
				createTime: parseTime(new Date(), "{y}-{m}-{d} {h}:{i}:{s}"),
				showpop: false,
				array: [1, 2, 3, 4, 5]
			}
		},
		methods: {
			getClassInfoData() {
				getClassInfo(this.classId).then(res => {
					console.log(res);
					this.classInfo = res.data
				})
			},
			openSubmit() {
				this.$refs.popup.open()
			},

			close() {
				this.$refs.popup.close()
			},
			confirm() {
				this.$refs.popup.close()
				let userId=null
				uni.getStorage({
					key:"teacherInfo",
					success: (res) => {
						userId=res.data.userId;
					}
				})
				const data = {
					classId: this.classInfo.classId,
					courseId: this.classInfo.courseId,
					userId: userId
				}
				console.log(data);
				delXiaokeCourceClass(data).then(res=>{
					console.log(res);
					uni.showToast({
						title: "消课成功"
					})
				})
				
				
			},
			bindPickerChange(e) {
				this.classInfo.classDeductHours = this.array[e.target.value]
			},

		},
		onLoad(option) {
			let _this = this;
			// 获取页面高度
			_this.$uniApi.getWindowHeight(_this);
			// console.log("log:", _this.$uniApi);
			console.log("classId:", option.classId);
			this.classId = option.classId;
			this.getClassInfoData();
		},
	}
</script>

<style>
	.content {
		width: 750rpx;
		background-color: #EEEEEE;
		position: relative;
	}

	.title {
		display: inline-block;
		width: 750rpx;
		color: #808080;
		font-size: 14px;
		line-height: 35px;
		padding-top: 5rpx;
		padding-left: 30rpx;
	}
</style>
